<template>
	<div class="myTask_list">
		<mu-list>
		    <mu-sub-header>近期待处理事项</mu-sub-header>
		    <mu-list-item v-for="list in taskTodo" :title="list.taskContent"
		    	@click="examineSet(list.implement == userInfo.mobile ? 'complete': 'examine', list.taskId)">
		    	<span class="typeCircle" :style="'background:' + $store.state.taskLevelColor[list.taskLevel]" slot="leftAvatar">
		    		{{$store.state.taskLevel[list.taskLevel]}}</span>
		    	<mu-icon value="check_circle" :color="$store.state.taskStatusColor[list.taskStatus]" slot="right"/>
		    	<label v-if="list.implement == userInfo.mobile" class="col_success mr_10">待完成</label>
		    	<label v-if="list.examine == userInfo.mobile" class="col_warning">待审核</label>
		    	<label v-else class="col_warning">审核人：{{mobileToName(list.examine)}}</label>
		    </mu-list-item>
		</mu-list>
		<mu-divider/>
		<mu-list>
		    <mu-sub-header>逾期未完成任务</mu-sub-header>
		    <mu-list-item v-for="list in taskComplete" :title="list.taskContent"
		    	@click="examineSet(list.implement == userInfo.mobile ? 'complete': 'examine', list.taskId)">
		    	<span class="typeCircle" :style="'background:' + $store.state.taskLevelColor[list.taskLevel]" slot="leftAvatar">
		    		{{$store.state.taskLevel[list.taskLevel]}}</span>
		    	<mu-icon value="check_circle" :color="$store.state.taskStatusColor[list.taskStatus]" slot="right"/>
		    	<label v-if="list.implement == userInfo.mobile" class="col_success mr_10">待完成</label>
		    	<label v-if="list.examine == userInfo.mobile" class="col_warning">待审核</label>
		    	<label v-else class="col_warning">审核人：{{mobileToName(list.examine)}}</label>
		    </mu-list-item>
		</mu-list>

		<examine-dialog :openData="examineDialog"></examine-dialog>
	</div>
</template>

<script>
import axios from 'axios'
export default{
	data(){
		return {
			examineDialog: {},
			userInfo: this.$store.state.userInfo,
			userList: this.$store.state.userList,
			taskTodo: [],
			taskComplete: [],
			//监听审核事件
			examineListen: 0,
			interval: {}
		}
	},
	methods: {
		//待处理弹窗
		examineSet(type, tid){
			if(type == 'complete'){	//待完成
				this.examineDialog = {
					openState: true,
					btnOk: true,
					tid: tid
				}
			}else{	//待审核
				this.examineDialog = {
					openState: true,
					btnExamine: true,
					btnDanger: true,
					tid: tid
				}
			}
				
		},
		//获取待处理任务
		getTaskTodo(){
			let params = {
				mobile: this.userInfo.mobile
			};

			axios.post($base + 'task/getTaskTodo', params).then(json => {
				this.taskComplete = [];
				this.taskTodo = [];
				
				json.data.forEach(e => {
					if(new Date(e.taskDate).getTime() < new Date(this.$store.state.curDate).getTime()){
						this.taskComplete.push(e)
					}else{
						this.taskTodo.push(e)
					}
				})
			}).catch(json => {
				console.log(json)
			})
		},
		//通过手机获取用户名
		mobileToName(mobile){
			let name = '';
			this.userList.map(list => {
				if(list.mobile == mobile){
					name = list.userName;
				}
			})
			return name;
		}
	},
	mounted(){
		var me = this;
		this.getTaskTodo();
		this.interval = setInterval(function(){
			me.examineListen = me.$store.state.examineListen;
		}, 500)
	},
	watch: {
		examineListen(data){
			this.getTaskTodo();
		}
	},
	destroyed(){
		clearInterval(this.interval);
	}
}
</script>